{% extends "base.html" %}

{% block title %}审核成功{% endblock %}

{% load static %}

{% block script %}
    <script src={% static "js/qrcode.min.js" %}></script>
    <script>
        $(document).ready(function () {
            $.ajax({
                url: "site",
                type: "get",
                dataType: "text",
                data: {
                    id_number: {{ id_number }}
                },
                success: function (site) {
                    $("#qr-code").qrcode({
                        width: 100,
                        height: 100,
                        text: site,
                        render: "canvas"
                    });
                }
            });
        });
    </script>
{% endblock %}

{% block style %}
    <style>
        body {
            background-image: url({% static "img/background.jpg" %});
            background-position: center center;
            background-repeat: no-repeat;
            background-size: cover;
        }
    </style>
{% endblock %}

{% block body %}
    <div class="container col-12 text-center font-weight-bold text-white">
        疫情就是命令&emsp;防控就是责任
    </div>
    <br><br>
    <h2 class="h2 col-12 text-center text-white font-weight-bold">居民出入</h2>
    <h1 class="h1 col-12 text-center text-white font-weight-bold" style="font-size: 60px;box-shadow: #5a6268;">通行证</h1>
    <br><br>
    <div class="col-12 text-center text-white">
        发证单位:
    </div>
    <br>
    <div class="col-12 text-center text-white">
        {{ district }}{{ street }}办事处
    </div>
    <br>
    <div class="col-12 text-center text-white">
        持证人: {{ name }}
    </div>
    <div class="col-12 text-center">
        (一人一证 扫码检验)
    </div>
    <div class="custom-control-inline text-white font-weight-bold align-text-bottom">
        <div class="col-8">
            <br><br>
            请大家给予理解<br>积极配合疫情防控工作
        </div>
        <div id="qr-code" class="right offset-3" style="height: 110px;"></div>
    </div>
{% endblock %}
